const path = require("path");
const HTMLWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const ParallelUglifyPlugin = require("webpack-parallel-uglify-plugin");
module.exports = {
    // 配置入口出口
    entry: "./js/cart.js",
    output: {
        // 配置打包之后的文件名
        filename: "cart.js",
        // 打包后文件输出路径
        path: path.resolve(__dirname, "./dist"),
        // 清理dist
        clean: true,
    },
    mode: "production",
    optimization: {
        minimizer: [new CssMinimizerPlugin()],
    },
    plugins: [
        // 引入html插件
        new HTMLWebpackPlugin({
            // html模板
            template: "./src/cart.html",
            // 打包后的文件名
            filename: "cart.html",
            // 设置所有资源注入位置
            inject: "body",
        }),
        // 实例化css插件
        new MiniCssExtractPlugin({
            filename: "styles/[contenthash:8].css",
        }),
        new ParallelUglifyPlugin({
            uglifyJS: {
                output: {
                    beautify: false,
                    comments: false,
                },
                compress: {
                    drop_console: true,
                    collapse_vars: true,
                    reduce_vars: false,
                },
            },
        }),
    ],
    module: {
        rules: [
            // 加载css-loader
            {
                test: /\.css$/i,
                use: [MiniCssExtractPlugin.loader, "css-loader"],
            },
        ],
    },
};
